<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@include file="../taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>table模块快速使用</title>
    <link rel="stylesheet" href="/assets/css/layui.css" media="all">

</head>
<body style="padding:20px 100px 0 100px">

<form class="layui-form layui-form-pane" action="/permission/updatePermission" id="form">
    <input value="${vo.id}" name="id" type="hidden"/>
    <div class="layui-form-item">
        <label class="layui-form-label">用户名称</label>
        <div class="layui-input-block">
            <input type="text" name="username" value="${vo.username}" lay-verify="username" autocomplete="off" placeholder="请输入用户名称" class="layui-input" id="username">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">真实名称</label>
        <div class="layui-input-block">
            <input type="text" name="realname" value="${vo.realname}" lay-verify="realname" autocomplete="off" placeholder="请输入真实名称" class="layui-input" id="realname">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">联系电话</label>
        <div class="layui-input-block">
            <input type="text" name="phone" value="${vo.phone}" lay-verify="phone" autocomplete="off" placeholder="请输入用户名称" class="layui-input" id="phone">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">电子邮箱</label>
        <div class="layui-input-block">
            <input type="text" name="email" value="${vo.email}" lay-verify="email" autocomplete="off" placeholder="请输入电子邮箱" class="layui-input" id="email">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">是否可用</label>
        <div class="layui-input-block">
            <select name="locked" lay-filter="locked" id="locked">
                <option value="1" <c:if test="${vo.locked==1}">selected=""</c:if>>锁定</option>
                <option value="0" <c:if test="${vo.locked==0}">selected=""</c:if>>未锁定</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>

<script src="/assets/layui.js"></script>
<script>
    layui.use(['form', 'layedit', 'laydate'], function() {
        var form = layui.form,
            layer = layui.layer,
            layedit = layui.layedit,
            laydate = layui.laydate;
        var $ = layui.jquery, laypage = layui.laypage, layer = parent.layer === undefined ? layui.layer: parent.layer;

        //创建一个编辑器
        var editIndex = layedit.build('LAY_demo_editor');
        //自定义验证规则
        form.verify({
            username: function(value) {
                if(value.length < 1) {
                    return '用户名称是必填项';
                }
            },realname: function(value) {
                if(value.length < 1) {
                    return '真实姓名是必填项';
                }
            },phone: function(value) {
                if(value.length < 1) {
                    return '联系电话是必填项';
                }
            },password: function(value) {
                if(value.length < 1) {
                    return '登录密码是必填项';
                }else if(value.length < 6){
                    return '登录密码不能小于6位';
                }else if(value.length > 12){
                    return '登录密码不能大于12位';
                }
            },
        });

        //监听提交
        form.on('submit(demo1)', function(data) {
            $.ajax({
                type : "POST",  //提交方式
                url : "/user/updateSystemUser",//路径
                data : $('#form').serialize(),//数据，这里使用的是Json格式进行传输
                success : function(result) {//返回数据根据结果进行相应的处理
                    var state = result.status;
                    if(state=="0"){
                        var index = parent.layer.getFrameIndex(window.name);   //关闭弹出层
                        parent.layer.close(index);
                        layer.alert("保存成功!");
                    }else{
                        layer.alert("保存失败!请重试");
                    }
                }
            });
            return false;
        });
    });
</script>
</body>
</html>
